<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
<!--    <style>
/*        p{
            color:yellow;
            font-size:60px;
        }*/
    </style>-->
    <link rel="stylesheet" href="01style.css">
</head>
<body>
<!--
网页分成三个部分
   结构(HTML)
   表现(CSS)
   行为(JavaScript)
CSS
   层叠样式表
   网页实际上是一个多层的结构，通过CSS可以分别为网页的每一个层来设置样式
      而我们能看到的只是网页的最上一层
   总之一句话，CSS用来设置网页中元素的样式
使用CSS来修改元素的样式
-->
<!--第一种方式（内联样式，行内样式）
   在标签内部通过style属性来设置元素的样式
   问题：
       使用内联样式，样式只能对一个标签生效
       如果希望影响到多个元素必须在每个元素中都复制一遍
       并且当样式发生变化时，我们必须要一个一个的修改，非常的不方便
       注意：开发时绝对不要用内联样式
   第二种方式（内部样式表）
       将样式编写到head中的style标签里
       通过CSS的选择器来选中元素并为其设置各种样式
       可以同时为多个标签设置样式，并且修改时只需要修改一处即可全部应用
       内部样式更加方便对样式进行复用
   问题：
       内部样式表只能对一个网页起作用，它里边的样式不能跨页面进行复用
   第三种方式（外部样式表）
       可以将CSS样式编写到一个外部的CSS文件中
         然后通过link标签来引入外部的CSS文件
       外部样式表需要通过linke标签进行引入
         意味着只要想使用这些样式的网页都可以对其进行引用
         使样式可以在不同页面之间进行复用
       将样式编写到外部的CSS文件中，可以只用到浏览器的缓存机制，从而加快网页的加载速度，提高用户的体验。
-->
<p style="color:red;font-size:60px">老华离家老大回，乡音无改鬓毛衰</p>
<p>老华离家老大回，乡音无改鬓毛衰</p>
</body>
</html>